<template>
  <div>
    <el-container style="height: 696px; border: 1px solid #eee">
      <Left></Left>
      <el-container>
        <el-header style="text-align: right; font-size: 12px;width: 100%;">
          <Top></Top>
        </el-header>
        <el-main>
          <div>领导人事管理</div>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import Left from '@/components/adminSide/left'
import Top from '@/components/adminSide/top'

export default {
  name: 'leaderPersonnel',
  components: {
    Left,
    Top
  }
}
</script>

<style>
  .el-header {
    background-color: #B3C0D1;
    color: #333;
    line-height: 60px;
  }

  .el-aside {
    color: #333;
  }
</style>
<style scoped>
  .router-link-active {
    text-decoration: none;
    color: yellow;
  }

  a {
    text-decoration: none;
    color: white;
  }

  .el-chart-a {
    width: 1200px;
    height: 500px;
    margin: 10px auto;
  }

  .el-chart-1 {
    width: 400px;
    height: 400px;
    border-radius: 4px;
    list-style-type: none;
    margin-left: 40px;
    margin-right: 50px;
  }

  .el-chart-2 {
    width: 400px;
    height: 400px;
    border-radius: 4px;
    list-style-type: none;
  }

  .el-chart-b {
    width: 1200px;
    height: 500px;
    margin: 20px auto;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .30);
  }

  li {
    float: left;
  }

  .el-chart {
    width: 100%;
    height: 250px;
  }

  .el-chart ul li {
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .30);
    width: 220px;
    height: 120px;
    /*border: 1px solid gold;*/
    list-style-type: none;
    margin-right: 50px;
  }

  .el-chart ul li:hover {
    background-color: #eee;
  }
</style>
